import axios from 'axios'
import VueCookies from 'vue-cookies'
import router from '@/router'
import gv from '@/utils/global-var'

const http = axios.create({
  baseURL: 'http://localhost:8081'
})

/**
 * 1.添加一个请求拦截器(这就是axios比jquery的ajax强大之处)
 * 2.最终请求携带到服务器的数据取决于方法的返回值。
 */
http.interceptors.request.use(config => {
  // 如果cookie中有 access_token, 那么在请求的时候就在请求头中使用
  // Authorization携带 jwt
  if (VueCookies.get('access_token')) {
    config.headers['Authorization'] = VueCookies.get('access_token')
  }
  return config
})

/**
 * 1. 响应拦截器, 在其他所有的网络请求拿到数据其实是该响应拦截器第一个方法的返回值
 * 2. 响应拦截的第二个方法是当服务端返回的响应状态码 >= 400 的时候走的方法
 */
http.interceptors.response.use(res => {
  // console.log('响应拦截', res)
  return res.data
}, err => {
  // console.log('错误', err.response)
  const status = err.response.status // 获取错误的状态码
  if (status === 401) {
    VueCookies.remove('access_token')
    VueCookies.remove('username')
    gv.flag = false
    // this.$router 这种方式只能在 Vue组件中使用，在非Vue组件组件只能使用另外的方式
    // this.$router.push
    router.push('/login')
  }
  // 表示抛出一个异常给其他响应结果
  return Promise.reject(err)
})

export default http
